/*公共样式*/
* {
    box-sizing: border-box;
    /*去除浏览器默认样式*/
    padding: 0;
    margin: 0;
}
html {
    height: 100%;
}

body {
/* 让图片尽可能填满整个元素 */
background-image: url(../image/blackground.jpg);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;

height: 100%;
}
/* 导航栏 */
.nav {
    width: 100%;
    /* 导航栏的高度都是50px */
    height: 50px;
    background-color: rgba(50, 50, 50, 0.4);
    /* 设置导航栏透明度 */
    color: white;

    /* 使用弹性布局，让里面的元素水平排列 */
    display: flex;
    align-items: center;
}
/* 导航栏中的logo */
.nav img {
    width: 40px;
    height: 40px;
    /* 左右设置外边距 */
    margin-left: 30px;
    margin-right: 10px;
    /* 设置圆角矩形 */
    border-radius: 20px;
}
/* 导航栏中选项中超链接标签的设置 */
.nav a {
    color: white;
    /* 去掉 a 标签的下划线 */
    text-decoration: none;
    /* 使用内边距把多个链接分出来距离 */
    padding: 0 10px;
}
/* 使用一个空白的span标签 */
.nav .spacer {
    width: 70%;
}
